﻿@{
    ViewBag.Title = "SetBoard";
    Layout = "~/Views/Shared/_LayoutForLoggedIn.cshtml";
}

<h2>Ludo</h2>

<body>
	<table id="TableForLudo">
		<tr>
		  <td class="tab1" colspan="6" rowspan="1"></td>
		  <td id="24"></td>
		  <td id="25"></td>
		  <td id="26"></td>
		  <td class="tab3" colspan="6" rowspan="1"></td>
		</tr>
		<tr>
		  <td class="tab1" colspan="1" rowspan="5"></td>
		  <td class ="reit1"></td>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td class="tab1" colspan="1" rowspan="5"></td>
		  <td id="23"></td>
		  <td class="tab3"></td>
		  <td id="HeimaRA" class="tab3"></td>
		  <td class="tab3" colspan="1" rowspan="5"></td>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td class="tab3" colspan="1" rowspan="5"></td>
		</tr>
		<tr>
		  <td></td>
		  <td class="tab1"><img class="ped" id="ped1-BL" src="https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-frc3/972148_10200601144083741_1921110951_n.jpg"></td>
		  <td class="tab1"><img class="ped" id="ped2-BL"src="https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-frc3/972148_10200601144083741_1921110951_n.jpg"/></td>
		  <td></td>
		  <td id="22"></td>
		  <td class="tab3"></td>
          <td id="28"></td>
		  <td></td>
		  <td class="tab3"><img  class="ped" id="ped1-RA" src="https://fbcdn-sphotos-a-a.akamaihd.net/hphotos-ak-ash3/255587_10200601144003739_863955287_n.jpg"/></td>
		  <td class="tab3"><img  class="ped" id="ped2-RA" src="https://fbcdn-sphotos-a-a.akamaihd.net/hphotos-ak-ash3/255587_10200601144003739_863955287_n.jpg"/></td>
		  <td></td>
		</tr>
		<tr>
		  <td></td>
		  <td class="tab1"><img  class="ped" id="ped3-BL" src="https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-frc3/972148_10200601144083741_1921110951_n.jpg"/></td>
		  <td class="tab1"><img  class="ped" id="ped4-BL" src="https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-frc3/972148_10200601144083741_1921110951_n.jpg"/></td>
		  <td></td>
		  <td id="21"></td>
          <td class="tab3"></td>
		  <td id="29"></td>
		  <td></td>
		  <td class="tab3"><img class="ped" id="ped3-RA" src="https://fbcdn-sphotos-a-a.akamaihd.net/hphotos-ak-ash3/255587_10200601144003739_863955287_n.jpg"/></td>
		  <td class="tab3"><img class="ped" id="ped4-RA" src="https://fbcdn-sphotos-a-a.akamaihd.net/hphotos-ak-ash3/255587_10200601144003739_863955287_n.jpg"/></td>
		  <td></td>
		</tr>
		<tr>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td id="20"></td>
          <td class="tab3"></td>
		  <td id="30"></td>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td></td>
		</tr>
		<tr>
		  <td class="tab1" colspan="5" rowspan="1"></td>
		  <td id="19"></td>
          <td class="tab3"></td>
		  <td id="31"></td>
		  <td class="tab3"  colspan="6" rowspan="1"></td>
		</tr>
		<tr>
		  <td id="13"></td>
		  <td id="HeimaBL" class="tab1"></td>
		  <td id="15"></td>
		  <td id="16"></td>
		  <td id="17"></td>
		  <td id="18"></td>
		  <td rowspan="3" colspan="3" align="center" bgcolor="white"><strong>HOME</strong></td>
		  <td id="32"></td>
		  <td id="33"></td>
		  <td id="34"></td>
		  <td id="35"></td>
		  <td id="36"></td>
		  <td id="37"></td>		  
		</tr>
		<tr>
		  <td id="12"></td>
		  <td class="tab1" ></td>
          <td class="tab1"></td>
          <td class="tab1"></td>
          <td class="tab1"></td>
          <td class="tab1"></td>
		  <td class="tab4"></td>
          <td class="tab4"></td>
          <td class="tab4"></td>
          <td class="tab4"></td>
          <td class="tab4"></td>
		  <td id="38"></td>
		</tr>
		<tr>
		  <td id="11"></td>
		  <td id="10"></td>
		  <td id="9"></td>
		  <td id="8"></td>
		  <td id="7"></td>
		  <td id="6"></td>
		  <td id="44"></td>
		  <td id="43"></td>
		  <td id="42"></td>
		  <td id="41"></td>
		  <td id="HeimaGR" class="tab4"></td>
		  <td id="39"></td>
		</tr>
		<tr>
		  <td class="tab2" colspan="6" rowspan="1" ></td>
		  <td id="5"></td>
		  <td class="tab2"></td>
		  <td id="45"></td>
		  <td class="tab4" colspan="6" rowspan="1"></td>
		</tr>
		<tr>
		  <td class="tab2" rowspan="5" colspan="1"></td>
		  <td></td>
		  <td></td>
          <td></td>
		  <td></td>
		  <td class="tab2" colspan="1" rowspan="5"></td>
		  <td id="4"></td>
          <td class="tab2"></td>
		  <td id="46"></td>
		  <td class="tab4" colspan="1" rowspan="5"></td>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td class="tab4" colspan="1" rowspan="5"></td>
		</tr>
		<tr>
		  <td></td>
		  <td class="tab2"><img class="ped" id="ped1-GU" src="https://fbcdn-sphotos-f-a.akamaihd.net/hphotos-ak-frc3/971544_10200601143963738_1622378441_n.jpg"></td>
		  <td class="tab2"><img class="ped" id="ped2-GU" src="https://fbcdn-sphotos-f-a.akamaihd.net/hphotos-ak-frc3/971544_10200601143963738_1622378441_n.jpg"/></td>
		  <td></td>
		  <td id="3"></td>
		  <td class="tab2"></td>
          <td id="47"></td>
		  <td></td>	
		  <td class="tab4"><img class="ped" id="ped1-GR" src="https://fbcdn-sphotos-g-a.akamaihd.net/hphotos-ak-ash3/942890_10200601144043740_429578419_n.jpg"/></td>
		  <td class="tab4"><img class="ped" id="ped2-GR" src="https://fbcdn-sphotos-g-a.akamaihd.net/hphotos-ak-ash3/942890_10200601144043740_429578419_n.jpg"/></td>
		  <td></td>
		</tr>
		<tr>
		  <td></td>
		  <td class="tab2"><img class="ped" id="ped3-GU" src="https://fbcdn-sphotos-f-a.akamaihd.net/hphotos-ak-frc3/971544_10200601143963738_1622378441_n.jpg"/></td>
		  <td class="tab2"><img class="ped" id="ped4-GU" src="https://fbcdn-sphotos-f-a.akamaihd.net/hphotos-ak-frc3/971544_10200601143963738_1622378441_n.jpg"/></td>
		  <td></td>
		  <td id="2"></td>
          <td class="tab2"></td>
		  <td id="48"></td>
		  <td></td>
		  <td class="tab4"><img class="ped" id="ped3-GR" src="https://fbcdn-sphotos-g-a.akamaihd.net/hphotos-ak-ash3/942890_10200601144043740_429578419_n.jpg"/></td>
		  <td class="tab4"><img class="ped" id="ped4-GR" src="https://fbcdn-sphotos-g-a.akamaihd.net/hphotos-ak-ash3/942890_10200601144043740_429578419_n.jpg"/></td>
		  <td></td>
		</tr>
		<tr>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td id="HeimaGU" class="tab2"></td>
          <td class="tab2"></td>
		  <td id="49"></td>
		  <td></td>
		  <td></td>
		  <td></td>
		  <td></td>
		</tr>
		<tr>
		  <td class="tab2" rowspan="1" colspan="5"></td>
		  <td id="52"></td>
		  <td id="51"></td>
          <td id="50"></td>
		  <td class="tab4"  colspan="6" rowspan="1"></td>
		</tr>
	</table>	
    <div id="DiceForLudo">
        <img id="Teningur" src="http://2.bp.blogspot.com/__WKt7QbHjAo/TT12oezdKJI/AAAAAAAAACA/7uBZnkEhrjU/s1600/Die_Spire_01_4832.png" />
        <div id="TextboxDice"></div>
    </div>
</body>

<script>
    $(function ()
    {
        var group = 5;
        var hub = $.connection.gameHub;

        //Teningurinn
        hub.client.rollDie = function (valueOfDie)
        {
            $("#TextboxDice p").hide();
            $("#TextboxDice").append("<p>" + valueOfDie + "</p>"); 
        };

        //Komast frá heimasvæði
        hub.client.moveFromHome = function (pedID, cellID, img)
        {
            //Sæki gildi teningsins
            var valueOfDice = document.getElementById('TextboxDice');
            var subValueOfDice = valueOfDice.innerHTML.substr(3, 1);

            if (subValueOfDice == "6")
            {
                $("#" + pedID).hide();
                $("#" + cellID).append('<img class="ped" id="#' + pedID + '" src="' + img + '"/>');

                //Bæti H við hvert pedID til að vita hvort peðið sé farið úr heimareitnum eða ekki
                //pedID = pedID + "H";
            }
            //if(subValueOfDice != "6" && (ped.substr(7,1)) == "H"
        };

        $.connection.hub.start().done(function ()
        {
            hub.server.join(group);
        
            $("#Teningur").click(function ()
            {
                document.getElementById("TextboxDice").innerHTML = "";
                hub.server.rollDice(group);
            });

            $(".ped").click(function ()
            {
                //Sæki litinn sem er á peðinu og bý til breytu sem inniheldur heimareitinn
                var substring = (this.id).split('-', 2);
                var color = substring[1];
                var cell = ("Heima" + color);

                hub.server.moveFromHome(group, this.id, cell, color);                  
            });
        });
    });
</script>